Gallery Landing
Page Builder

Load your copy from the Gallery Page Writer or answer the brief, add your photos, and get two finished versions of your page to choose from.

Don Giannatti · Creative Consultant

How this works

1. Add your API key. Get one at console.anthropic.com under API Keys. Your key goes only to Anthropic. Check "Remember" to keep it in this browser; leave it off on a shared computer.

2. Start from a Writer file, or from scratch. If you made a .json file in the Gallery Page Writer, load it first. It fills in the brief, the sections, the design, and all the finished copy, so the Builder does not need to write anything. No file? Fill in the brief and the Builder writes the copy.

3. Optional design file. Load a design.md and the page follows it. Without one, Claude proposes two different looks for you to compare.

4. Add your photos. Drop them on the photo slots. They are resized and built into the page, so there is no images folder to manage. Add a short description to each one for search engines and screen readers. Empty gallery slots are left off the finished page.

5. Compare, adjust, download. Switch between Version A and Version B, fine-tune colors and fonts, edit any line of copy, then download index.html. Save the project as .json to come back to it later (photos are not saved in the project file).

Your key is sent only to Anthropic. It is saved in this browser only if "Remember" is checked; leave it off on shared computers.
Using the built-in list. Click "Update models" to pull the current models for your key from Anthropic.
Start From a Writer File optional

Load a .json file from the Gallery Page Writer, or a project you saved here. Everything below fills in for you.

Drop a .json file here or click to choose one
The Basics
The Audience
The Details
The Voice
Page Sections
Design File optional

A design.md from the Gallery Page Writer is applied exactly. Other design files are read by Claude and turned into colors, fonts, and layout. You can adjust everything after the page is built.

Drop a design.md here or click to choose one
Your Photos
Copy as it's written
Design for this version

Your photos
Edit the copy

Both versions share this copy. Edit any line and the preview updates. Keep the labels at the start of each line (HEADLINE:, ITEM:, Q:). For lists, put a | between the name and the description.

Drop a photo on any slot, or click it to choose one. Photos are resized for the web and built into the page. Add a short description of each photo; it helps search engines and people using screen readers.